<template>
       <div>
    <el-table :data="tableData" style="width: 100%"  row-key="id" height="432"  default-expand-all cell-class-name="cell-row" header-cell-class-name="header-row">
    <el-table-column prop="categoryName" label="产品大类">
      </el-table-column>
    <el-table-column prop="name" label="产品名称" />
    <el-table-column prop="salesQuantity" label="销售数量" />
    <el-table-column prop="quantityYearOnYear" label="同比" />
     <el-table-column prop="salesAmount" label="销售金额" />
      <el-table-column prop="amountYearOnYear" label="同比" />
  </el-table>
       </div>
</template>

<script>
export default {
      props:{
    tableData:{
      type:Array,
      default: ()=>{}
    }
  },
         data(){
             return{
                 headerStyle:{
                     'background':'#FFF8EC'
                 }
             }
         },

}
</script>

<style scoped>
.el-table .warning-row {
  --el-table-tr-bg-color: var(--el-color-warning-light-9);
}
/deep/.el-table .header-row {
  background-color:#FFF8EC !important;
  height: 60px;
}
/deep/.el-table .header-row .cell{
    /* margin-top: 2.5rem; */
    text-align: center;
    font-size: 15px;
font-weight: 400;
color: var(--el-color-text-3);
line-height: 22px;
}
/deep/.el-table__row .cell-row{
    height: 60px !important;
}
/deep/.cell-row .cell{
      text-align: center;
    font-size: 15px;
font-weight: 400;
color: var(--el-color-text-3);
line-height: 22px;
}
</style>